<!DOCTYPE html>
<html lang="en">
<style>
    ul.group-list li {
        white-space: nowrap;float: left;
        width: 150px; height: 25px;
        padding: 3px 5px;list-style-type: none;
        list-style-position: outside;border: 0px;margin: 0px;
    }
    input[type=checkbox], input[type=radio] {
        display: inline-block;
    }
</style>

{include file="Public/head"}

<body data-type="widgets">
<script src="/assets/js/theme.js"></script>
<div class="am-g tpl-g">

    {include file='Public:header'}
    {include file='Public:menu2'}



    <!-- 内容区域 -->
    <div class="tpl-content-wrapper" >
        <div class="row-content am-cf">
            <div class="row">

                <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                    <div class="widget am-cf">
                        <div class="widget-head am-cf">
                            <div class="widget-title am-fl">编辑商品分类</div>
                            <div class="widget-function am-fr">
                                <div class="navbar-form pull-right margin">
                                    <a href="javascript:history.go(-1)" data-toggle="tooltip" title="" class="btn btn-default" data-original-title="返回"><i class="fa fa-reply"></i></a>
                                </div>
                            </div>
                        </div>

                        <form form="submit" action="" method="post"class="am-form am-form-horizontal" id="roleform" enctype="multipart/form-data" >
                            <div class="am-form-group"  >
                                <label  class="am-u-sm-4 am-form-label">分类名称</label>
                                <div class="am-u-sm-8" >
                                    <input type="hidden" name="id" value="{$comm.id}">
                                    <input type="text" id="name" name="name" placeholder="名称" style="width:500px;" value="{$comm.name}">
                                </div>
                            </div>
                            <div class="am-form-group"  >
                                <label class="am-u-sm-4 am-form-label">手机分类名称</label>
                                <div class="am-u-sm-8" >
                                    <input type="text" id="mobile_name" name="mobile_name" placeholder="手机分类名称" value="{$comm.mobile_name}" style="width:500px;">
                                </div>
                            </div>
                            <div class="am-form-group" id="classdiv">
                                <label class="am-u-sm-4 am-form-label">上级分类</label>

                                {foreach name="parent_id_path" key="k" item="v"}
                                <div class="am-u-sm-2 ">
                                    <select name="class[]" onchange="subclass(this)" class="am-u-sm-8">
                                        <option value="0">{if $k==0}顶级分类{else}创建新的分类{/if}</option>
                                        {foreach name='v' key="key" item="value"}
                                        {notempty name="$value.id"}
                                        <option value="{$value.id}" {if count($parent_id_path)!="1"}{if $classid[$k+1]==$value.id}selected="selected"{/if}{/if}>{$value.name}</option>
                                        {/notempty}
                                        {/foreach}
                                    </select>

                                </div>
                                {/foreach}

                             </div>
                            <div class="am-form-group"  >
                                <label class="am-u-sm-4 am-form-label">导航显示</label>
                                <div class="am-u-sm-8" style="margin-top: 10px;" >
                                    <input {if $comm.is_show=="1" }checked="checked" {/if}type="radio" name="is_show" value="1"> 是
                                    <input type="radio" name="is_show" {if $comm.is_show=="0" }checked="checked" {/if} value="0"> 否
                                </div>
                            </div>

                            <!--<div class="am-form-group"  >-->
                                <!--<label class="am-u-sm-4 am-form-label">分类分组：</label>-->
                                <!--<div class="am-u-sm-8" >-->
                                    <!--<select name="group" id="group" class="form-control" style="width: 80px">-->
                                        <!--{for}-->
                                        <!--<option value="0">0</option>-->
                                        <!--<option value='1'>1</option>"-->
                                        <!--<option value='2'>2</option>"-->
                                        <!--<option value='3'>3</option>"-->
                                        <!--<option value='4'>4</option>"-->

                                    <!--</select>-->
                                <!--</div>-->
                            <!--</div>-->
                            <div class="am-form-group"  >
                                <label class="am-u-sm-4 am-form-label">分类展示图片1:1</label>
                                <div class="am-u-sm-8" >
                                    <input type="file" value="" name="image" id="image" onchange="imgPreview(this)"  accept="image/jpg,image/jpeg,image/png,image/PNG" class="form-control large" style="width:500px;margin-top:10px; "/>
                                    <img src="{$comm.image}" id="img3"style="width: 200px;text-align: center"/>
                                </div>
                                <div class="am-form-group"  >
                                    <label class="am-u-sm-4 am-form-label">显示排序</label>
                                    <div class="am-u-sm-8" >
                                        <input type="text" placeholder="50" class="form-control large" name="sort_order" value="{$comm.sort_order}" style="width: 80px" />
                                        <span class="help-inline" style="color:#F00; display:none;" id="err_sort_order"></span>
                                    </div>
                                </div>


                                <div class="box-footer">
                                    <button type="reset" onclick="javascript:history.back(-1);"  class="am-btn am-btn-secondary">返回</button>
                                    <input type="submit" class="am-btn am-btn-secondary" style="float: right"><i class="icon-ok"></i></input>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>

</body>
{include file='Public:script'}
{include file='Public:validation'}

<script>
    //提交
    function roleSubmit(){
        var form=document.getElementById("roleform");
        var formData=new FormData(form);
        $.ajax({
            url:"{:Url('classifyAddData')}",
            type:'POST',
            data:formData,
            async: false,
            cache: false,
            contentType: false, //不设置内容类型
            processData: false, //不处理数据
            success:function(res){
                if (res.code != 200) {
                    layer.msg(res.msg, {shade: 0.5, time: 2000,icon: 2});
                    return false;
                }
                layer.msg(res.msg, {shade: 0.5, time: 2000, icon: 1}, function(){
                    window.location.href=document.referrer;

                });
            }
        });

    }
//在线浏览图片
    function imgPreview(fileDom) {
        //判断是否支持FileReader
        if(window.FileReader) {
            var reader = new FileReader();
        } else {
            alert("您的设备不支持图片预览功能，如需该功能请升级您的设备！");
        }
        //获取文件
        var file = fileDom.files[0];
        var imageType = /^image\//;
        //是否是图片
        if(!imageType.test(file.type)) {
            alert("请选择图片！");
            return;
        }
        //读取完成
        reader.onload = function(e) {
            //获取图片dom
            var img = document.getElementById("img3");
            //图片路径设置为读取的图片
            img.src = e.target.result;
            $("#img3").css("display", "block")
        };
        reader.readAsDataURL(file);
    }

    /*
          选中分类开启子分类选项
         */
    function subclass(v) {
        // console.log(v);

        $(v).parent().nextAll().remove();//删除后面子分类
        if (0==v.value){
            return false;
        }
        $classdiv=$("#classdiv").html();//原有的分类代码
        var param = new Object();
        param['parent_id']   = v.value;
        $.post("{:url('subclass')}", param, function (res) {
            $('#classdiv').append(res);
        });
    }
</script>


</html>